<template>
	<view class="finish">
		<view class="natice bg-white padding-sm">
			<text class="iconfont icon-tongzhi padding-right" style=""></text>
			这里是文字
		</view>
		<view class="dai bg-white padding-top padding-bottom-xs">货物已安全送达<view class="iconfont icon-right text-gray"></view></view>
		<view class="text-gray text-sm bg-white text-center">这里是文字</view>
		<view class="btn bg-white padding ">
			<button class="cu-btn lines-gray text-black margin-right" >再来一单</button>
			<button class="cu-btn bg-yellow text-white" >分享订单</button>
		</view>
		<view class="peop bg-white padding">
			<view class="peop_l"><image src="@/imgs/tou.png"></image></view>
			<view class="peop_m padding-left-sm">
				<view class="peop_m_01">送货员 某某</view>
				<view class="peop__m02 text-gray text-sm">满意率8%</view>
			</view>
			<view class="peop_r"><text class="cuIcon-phone"></text></view>
		</view>
		<view class="padding-top text-center bg-white">请对本次服务进行评价</view>
		<view class="text-sm text-center padding-bottom bg-white padding-top-xs">看不清写的啥</view>
		<view class="appraise bg-white text-center padding-bottom">
			<text class="iconfont icon-xingxing text-yellow " ></text>
			<text class="iconfont icon-xingxing" ></text>
			<text class="iconfont icon-xingxing" ></text>
			<text class="iconfont icon-xingxing" ></text>
			<text class="iconfont icon-xingxing" ></text>
		</view>
		<view class="eval bg-white">
			<button class="cu-btn lines-yellow text-yellow margin-left margin-bottom" >送件超快</button>
			<block v-for="(item,index) of list">
				<button class="cu-btn lines-gray text-gray margin-left margin-bottom" >送件超快</button>
			</block>
		</view>
		<navigator url="/pages/browse/browse">
		<view class="bg-white padding flex flex-direction margin-bottom-sm">
			<button class="cu-btn bg-yellow text-white lg" >匿名评价</button>
		</view></navigator>
		<Process></Process>
		<view class="list qy-bg-white margin-top-sm">
			<view class="li">
				<view class="li_m">取货时间</view>
				<view class="li_r">
					<view class="">立即取货</view>
				</view>
			</view>
			<view class="li">
				<view class="li_m">订单编号</view>
				<view class="li_r">H12331242314</view>
			</view>
			<view class="li">
				<view class="li_m">备注</view>
				<view class="li_r">无</view>
			</view>
			<view class="li">
				<view class="li_m">支付方式</view>
				<view class="li_r">微信支付</view>
			</view>
			<view class="li">
				<view class="li_m">订单总价</view>
				<view class="li_r">30.00<view class="iconfont icon-tishi"></view></view>
			</view>
		</view>
	</view>
</template>

<script>
	import Process from '@/components/qy/process.vue';
	export default {
		data() {
			return {
				list:[1,2,3,4,5]
			};
		},
		components:{
			Process
		}
	}
</script>

<style lang="scss">
.finish{
	.dai{display: flex;justify-content: center;font-weight: 600;color: #000;font-size: 16px;
		.iconfont{padding-top: 4px;font-weight: 100;}
	}
	.btn{display: flex;justify-content: center;border-bottom: 1px solid #F5F5F5;}
	.peop{display: flex;
		.peop_l image{width: 50px;height: 50px;border-radius: 50%;}
		.peop_m{line-height: 25px;flex-grow: 1;}
		.peop_r{font-size: 30px;padding: 10px 0 0 10px;}
	}
	.appraise{
		text{font-size: 30px;}
	}	
	.eval{display: flex;justify-content:space-around;flex-wrap: wrap;}
	.li{display: flex;border-bottom: 1px solid #F9F9F9;height: 50px;line-height: 50px;padding: 0 10px;
		.li_m{width: 90px;color: #A6A6AB;}
		.li_r{display: flex;}
	}
}
</style>
